<template>
  <div id="app">
    <add-com v-show="show==0"></add-com>
    <modify-com v-show="show==1"></modify-com>
    <list-com></list-com>
  </div>
</template>

<script>
import add from "./com/add.vue"
import list from "./com/list.vue"
import modify from "./com/modify.vue"

export default {
  name: 'app',
  data () {
    return {
      show: 0
    }
  },
  created(){
  	this.center.$on("listtoApp",()=>{
  		this.show = 1
  	})
  	this.center.$on("modifytoApp",()=>{
  		this.show = 0
  	})
  },
  components: {
  	//另一种声明组件名的方法，组件名在组件内部声明
  	[add.name]: add,
  	[list.name]: list,
  	[modify.name]: modify
  }
}
</script>

<style>

</style>
